<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"	
	xmlns:p="http://primefaces.org/ui"
	template="/pages/plantilla.xhtml">
	
	<ui:define name="title"> WORKSPACE: Gestion Archivo</ui:define>
	<ui:define name="contenido" >
	<f:view>
		<h:form id="myform" prependId="false" enctype="multipart/form-data">
		<style>
		.ui-autocomplete input {
    	width:300px;
		}
		</style>
		<p:growl id="growl" showDetail="true"/> 
				<table style="width:100%">
				<tr>
				<td colspan="2">
				</td>
				</tr>
				<tr>
				<td width="100px">
				<DIV style="width:300px;height:400px; overflow:scroll;">
					<p:commandButton title="Inicio" icon="ui-icon-home"
					actionListener="#{archivoController.deseleccionarCarpetasEv}" update="tree, fsBotones, dtarchi"/>
				    <p:tree value="#{archivoController.rutaRaiz}" var="carpeta" id="tree" dynamic="true" cache="false"
				    selection="#{archivoController.nodoSeleccionado}" selectionMode="single"> 
				    <p:ajax event="select" update=":myform:growl, :myform:dtarchi, :myform:fsBotones" 
				    listener="#{archivoController.cargarArchivosxCarpetaEv}" />
				    <p:ajax event="unselect" update=":myform:growl, :myform:dtarchi, :myform:tree, :myform:fsBotones" 
				    listener="#{archivoController.deseleccionarCarpetas}" /> 
				        <p:treeNode id="treeNode" expandedIcon="ui-icon-folder-open"  
                    	collapsedIcon="ui-icon-folder-collapsed">  
				            <h:outputText value="#{carpeta.nombreArchivoVirtual}" id="lblNode" />  
				        </p:treeNode>  
				    </p:tree>
				</DIV>
				</td>
				<td>
				<DIV style="width:100%;height:400px; overflow-y:scroll;">
					<p:fieldset id="fsBotones">
					<p:commandButton icon="ui-icon-folder-collapsed" title="Nueva Carpeta" actionListener="#{archivoController.limpiarCarpeta}"
					oncomplete="dlgNCarpeta.show();" rendered="#{archivoController.nuevaCarpHabilitado}" update="opCarp"/>
					<p:spacer width="10px" rendered="#{archivoController.nuevaCarpHabilitado}"/>
					<p:commandButton icon="ui-icon-arrowthickstop-1-n" title="Subir Archivo"
					onclick="dlgSAtchivo.show();" rendered="#{archivoController.subirArchHabilitado}"/>
					<p:spacer width="10px" rendered="#{archivoController.subirArchHabilitado}"/>
					<p:commandButton icon="ui-icon-person" title="Compartir" rendered="#{archivoController.compartirHabilitado}"
					oncomplete="dlgCompartir.show();" actionListener="#{archivoController.cargarPermisosxCarpeta}" 
					update="opComp, spCompartir"/><p:spacer width="10px" rendered="#{archivoController.compartirHabilitado}"/>
					<p:commandButton actionListener="#{archivoController.descargarArchivoEv}" rendered="#{archivoController.descargaHabilitada}"
					icon="ui-icon-arrowthickstop-1-s" ajax="false" update="growl" title="Descargar Archivo"/>
					<p:spacer width="10px" rendered="#{archivoController.descargaHabilitada}"/>
					<p:commandButton title="Eliminar" update="growl, tree, dtarchi" icon="ui-icon-trash"
					rendered="#{archivoController.eliminarHabilitado}" actionListener="#{archivoController.eliminarArchivo}"/>
					</p:fieldset>
					<p:dataTable var="archivos" value="#{archivoController.archivosxCarpeta}" id="dtarchi" 
					                 rowKey="#{archivos.idArchivo}" selectionMode="single" rows="100"
					                 selection="#{archivoController.archivoSeleccionado}">
					<p:ajax event="rowSelect" update=":myform:fsBotones" listener="#{archivoController.actualizarBotones}"/>
					        <p:column headerText="Nombre del Archivo">
					            <h:outputText value="#{archivos.nombreArchivoVirtual}" />
					        </p:column>
					        <p:column headerText="Grupos">
					        <p:dataList value="#{archivos.grupos}" var="grupo">
					        #{grupo.nomGrupo}
					        </p:dataList>
					        </p:column>
					</p:dataTable>  
				</DIV>
				</td>
				</tr>
				</table>
		<p:dialog widgetVar="dlgNCarpeta" header="Ingresar Nueva Carpeta">
			<p:outputPanel id="opCarp">
			<p:inputText style="width:300px" value="#{archivoController.carpetaEditar.nombreArchivoVirtual}"/>
			<p:spacer width="10px"/>
			<p:commandButton icon="ui-icon-disk" title="Crear Carpeta" actionListener="#{archivoController.crearCarpetaEv}" update="growl, tree"
			oncomplete="dlgNCarpeta.hide();"/>
			</p:outputPanel>
		</p:dialog>
		<p:dialog widgetVar="dlgSAtchivo" header="Subir Archivo">
			<p:outputPanel>
    		<p:fileUpload fileUploadListener="#{archivoController.subirArchivo}"  
            mode="advanced" oncomplete="dlgSAtchivo.hide();"
            update="growl, dtarchi"  
            sizeLimit="100000000"/> 
			</p:outputPanel>
		</p:dialog>
		<p:dialog widgetVar="dlgCompartir" header="Compartir Archivo">
			<p:outputPanel id="opComp">
			<table>
			<tr>
				<td>
				<p:autoComplete id="acSimple" value="#{archivoController.grupoCompartir.nomGrupo}"   
                    completeMethod="#{archivoController.complete}">
                <p:ajax event="itemSelect" listener="#{archivoController.handleSelect}" update="acSimple" />
                </p:autoComplete>
				</td>
				<td>
				</td>
				<td><p:commandButton value="Compartir" actionListener="#{archivoController.guardarPermiso}" update="spCompartir, opComp"/></td>
			</tr>
			</table>
			</p:outputPanel>  
			<p:scrollPanel id="spCompartir" style="width:400px;height:300px">
				<p:dataTable id="dtUsuarios" var="grupo" value="#{archivoController.listGrupos}"  
				                 rows="50"  rowKey="#{grupo.idGrupo}"
				                 >
				        <p:column headerText="Grupos">
				            <h:outputText value="#{grupo.nomGrupo}" />
				            <p:dataList value="#{grupo.usuarios}" var="usu">
				            #{usu.nomUsuario}, #{usu.apePatUsuario} #{usu.apeMatUsuario}
				            </p:dataList>
				        </p:column> 
				        <p:column headerText="Eliminar" style="width:30px; align:center">
				            <p:commandButton icon="ui-icon-closethick" action="#{archivoController.eliminarGrupoSeleccionado}"
				            update="dtUsuarios">
				            <f:setPropertyActionListener value="#{grupo}" target="#{archivoController.grupoSeleccionado}"/>
				            </p:commandButton>
				        </p:column>
				</p:dataTable>  
			</p:scrollPanel>
		</p:dialog>
 		</h:form>
 		</f:view>
	</ui:define>
</ui:composition>